<template>
  <div>
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <van-collapse v-model="activeName" accordion>
        <div v-for="(item, index) in list" :key="index">
          <van-collapse-item :name="item.id">
            <template #title>
              <van-grid :column-num="item.pfbzs + 2">
                <van-grid-item :text="String(item.chname)" />
                <van-grid-item
                  v-for="(pfbzss, index999) in item.pfbzs"
                  :key="index999"
                  :text="String(item['pf' + (index999 + 1)])"
                />
                <van-grid-item :text="String(item.zf)" />
              </van-grid>
            </template>
            <p>{{ pfbz[1] }} :{{ item.chname }}</p>
            <p>{{ pfbz[0] }} :{{ item.username }}</p>
            <van-form @submit="updateScore(index)">
            <van-cell-group>
              <van-field
                v-model="item['pf' + (index3 + 1)]"
                required
                :label="pfbz[index3 + 2]"
                v-for="(pfbzxs, index3) in item.pfbzs"
                :key="index3"
                label-width="10em"
                :rules="[
              { required: true, message: '请输入分数' },
              {
                validator: (value) => {
                  if (value > pfbz666[index3] || value<0 ) {
                    return false;
                  } else {
                    return true;
                  }
                },
                message: '输入数据有误',
              },
            ]"
              />
            </van-cell-group>
            <p>{{ pfbz[item.pfbzs + 2] }}:{{ item.zf }}</p>
            <van-field
                v-model="item.memo"
                placeholder="请输入备注"
                label="备注"
                label-width="10em"
              />
            <van-button type="primary" native-type="submit" style="margin-top: 5px;">修改分数</van-button>
            </van-form>
          </van-collapse-item>
        </div>
      </van-collapse>
    </van-list>
  </div>
</template>

<script>
import axios from "axios";
export default {
  name: "ListPage",
  data() {
    return {
      value1: 0,
      option1: [
        { text: "全部学生", value: 0 },
        { text: "已答辩学生", value: 1 },
        { text: "未答辩学生", value: 2 },
        { text: "已评分成员", value: 3 },
        { text: "未评分成员", value: 4 },
      ],
      pfbz: ["学号", "姓名"],
      activeName: ["1"],
      fin: 0,
      lists: [],
      list: [{}],
      argumentes: [[]],
      unargumentes: [],
      loading: false,
      finished: false,
      pfbz666:[],
      
    };
  },
  mounted() {
    axios
      .post(
        "/scores/viewed?classId=" +
          this.$route.params.id +
          "&userId=" +
          localStorage.getItem("userId")
      )
      .then((res) => {
        this.pfbz = this.pfbz.concat(this.$store.state.pfbzmsg);
        this.pfbz.push("总分");
        // console.log(res);
        // console.log(res.data);
        // console.log(res.data.data);
        this.list = res.data.data;
        this.pfbz666 = this.$store.state.pfbz;
        console.log(this.list);
      })
      .catch((err) => {
        console.log(err);
      });
  },
  methods: {
    zf(index){
      this.list[index].zf = parseInt(this.list[index].pf1)+parseInt(this.list[index].pf2)+parseInt(this.list[index].pf3)+parseInt(this.list[index].pf4)+parseInt(this.list[index].pf5);
    },
    updateScore(index) {
      this.zf(index)
      console.log(this.list[index].zf);
      // console.log(this.list[index]);
      this.list[index].classId = this.$route.params.id;
      this.list[index].pfr = localStorage.getItem("userId");
      // let updateScore = Object.assign({}, this.list[index]);
      let updateScore = { ...this.list[index] };
      console.log(updateScore.memo);
      delete updateScore.chname;
      delete updateScore.pfbzs;
      delete updateScore.state;
      delete updateScore.username;
      for (let key in updateScore) {
        if (typeof updateScore[key] === "string") {
          updateScore[key] = parseInt(updateScore[key], 10);
        }
      }
      
      console.log(updateScore);
      // axios.post("/scores/update",{updateScore:updateScore})
      axios.post("/scores/update",updateScore)
        .then((res) => {
          console.log(res.data);
          this.$message.success("修改成功");
        })
        .catch((err) => {
          console.log(err);
          this.$message.error("修改失败");
        });
    },
    onLoad() {
      setTimeout(() => {
        for (let i = 0; i < 100; i++) {
          this.fin += 1;
        }

        this.loading = false;

        if (this.fin >= this.list.length) {
          this.finished = true;
        }
      }, 1000);
    },
  },
};
</script>

<style scoped>
.blue-text {
  color: skyblue;
}

.red-text {
  color: rgb(116, 193, 0);
}
</style>